<template>
	<view>
		<scroll-view style="height: 1500rpx;width: 750rpx;margin-top: 10rpx;" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered"
			:refresher-threshold="200" refresher-background="#D6D6D6" @refresherpulling="onPulling" @refresherrefresh="onRefresh" :scroll-top="scrollTop"  @scrolltolower="scrolltolower">
			<view class="tuijiankecheng_" v-for="(itme,index) in list_jigou_huan" :key="index" style="background: #FFFFFF;">
				<view style="display: flex;" @tap.stop="xiangqing(itme)">
					<view style="position: relative;">
						<image :src="itme.mechanism_logo" style="width: 195.02rpx;height: 195.02rpx;border-radius: 10.03rpx;border: #D6D6D6 0.09rpx solid;vertical-align: top;margin: 0;"></image>
						<view style="position: absolute;top: 0;left: 0;z-index: 12121;width: 70.7rpx;height: 35rpx;text-align: center;line-height: 35rpx;color: #FFFFFF;font-size: 20rpx;border-radius: 9rpx 0 9rpx 0 ;background: #FF3D3D;">{{itme.categories}}</view>
					</view>
					<view style="margin-left: 24.153rpx;width: 380rpx;box-sizing: border-box;padding-right: 20rpx;"> 
						<view style="font-size: 33rpx;color: #414141;font-weight: bold;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;width: 380rpx;">{{itme.mechanism_name}}</view>
						<view style="height: 30.8rpx;margin: 10rpx 0 10rpx 0;display: flex;align-items: center;">
							<view>
							</view>
							<view style="font-size: 25.717rpx;font-weight: bold;color: #474747;white-space:wrap;">
								<text >{{itme.juli}}</text>
								<text>km</text>
							</view>
						</view>
						<view style="font-size: 25.95rpx;color: #BEBEBE;width:inherit;white-space:wrap;display:block;   white-space:normal; ">
						   {{itme.mechanism_addr}}
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		<view v-if="shu_zi" style="font-size: 40rpx;color:#D6D6D6;font-weight: bold;text-align: center;">
			暂无数据
		</view>
	</view>
</template>
<script>
	export default {
		data(){
			return {
				weidu: "",
				jingdu: "",
				triggered: false,
				list_jigou_huan: [],
				res_: 1,
				num_: 1,
				xinjifou_ke: [],
				shu_zi: false,
				scrollTop: 0
			}
		},
		onLoad() {
			try{
				const val = uni.getStorageSync('storage_key')
				this.weidu = val.latitude
				this.jingdu = val.longitude
				this.xinjigou()
			}catch(e){}
		},
		methods:{
			async xinjigou(){
				let _this = this
				_this.triggered = true
				const res = await _this.$myRequest({
					url:'/mastermechanism/queryMechanismByType',
					method:"GET",
					data:{
						pageSize:10,
						currentPage:_this.num_,
						latitude:+_this.weidu,
						longitude:+_this.jingdu,
						type:"teach_paypal"
					}
				})
				let data = {
					title:"暂无课程",
					course_num:"",
					discount_amout:"",
					amout:""
				}
				if(res.data.length == 0){
					_this.res_ = 2
					_this.shu_zi = true
				}
				let a = []
				res.data.forEach((itme,index) => {
					if(itme.mechanism_logo == ""){
						res.data.splice(index,1)
					}
				})
				res.data.forEach((itme,index) => {
					a.push(itme)
				})
				let b = a
				b.forEach((itme,index) => {
					if(itme.map.masterSetPriceEntity.length == 0){
						itme.map.masterSetPriceEntity.push(data)
						itme.dis = false
					}else{
						itme.dis = true
					}
					itme.juli = _this.getDistance(itme.latitude,itme.longitude,_this.weidu,_this.jingdu).toFixed(1)
				})
				if( _this.xinjifou_ke.length == 0){
					 _this.xinjifou_ke = b
				}else if(  _this.xinjifou_ke.length > 0 && b.length > 0){
					_this.xinjifou_ke = _this.xinjifou_ke.concat(b)
				}
				_this.list_jigou_huan = _this.xinjifou_ke
				_this.triggered = false
			},
			rad(d) {
				return d * Math.PI / 180.0; 
			},
			getDistance(lat1, lng1, lat2, lng2) {
				let me = this
				var radLat1 = me.rad(lat1);
				var radLat2 = me.rad(lat2);
				var a = radLat1 - radLat2;
				var b = me.rad(lng1) - me.rad(lng2);
				var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
					Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
				s = s * 6378.137; // EARTH_RADIUS;
				s = Math.round(s * 10000) / 10000; //输出为公里
				var distance = s;
				var distance_str = "";
				if (parseInt(distance) >= 1) {
					distance_str = distance.toFixed(1) + "km";
				} else {
					distance_str = distance * 1000 + "m";
				}
				return s;
			},
			onRefresh() {
				this.triggered = true;
				this.xinjifou_ke = []
				this.num_ = 1
				this.xinjigou()
			},
			scrolltolower(){
				if(this.res_ == 1){
					this.num_++
					this.xinjigou()
				}
			},
			xiangqing(itt){
				uni.navigateTo({
					url:'/pages/Meet/jigouxiangqing/jigouxiangqing?id=' +  itt.id
				})
			},
		},
		onShow() {
			
		}
	}
</script>
<style lang="scss" scoped>
	.tuijiankecheng_{
		box-sizing: border-box;
		padding: 21.146rpx 52.548rpx 32rpx 55.57rpx ;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
</style>